<template>
  <div class="container">
    <div class="app-container">
      <el-button class="btn-add" size="mini" type="primary" @click="addPermission(0, 1)">添加权限</el-button>
      <el-table :data="list" row-key="id" default-expand-all>
        <el-table-column label="名称" prop="name"/>
        <el-table-column label="标识" prop="code"/>
        <el-table-column label="描述" prop="description"/>
        <el-table-column label= "操作" prop="name">
         <template v-slot="{row}">
          <el-button type="text" size="mini" v-if="row.type === 1" @click="addPermission(row.id, 2)">添加</el-button>
          <el-button type="text" size="mini" @click="editPermission(row.id)">编辑</el-button>
          <el-button type="text" size="mini" @click="delPermission(row.id)">删除</el-button>
         </template>
        </el-table-column>
      </el-table>
    </div>
    <add-dept :show-dialog.sync="showDialog" @updateDepartment="getPrimissionList()" ref="formData" :pidd="pidd" :typee="typee" :current-node-id="currentNodeId" @updateCurrentNodeId="currentNodeId = $event"/>
  </div>
</template>
<script>
import {getPrimissionList,delPermission} from '@/api/permission'
import {transListToTreeData} from '@/utils'
import AddDept from './components/add-dept.vue'
export default {
  name: 'Permission',
  components:{AddDept},
  data() {
    return {
      shuju:'',
      list:[],
      showDialog:false,
      pidd:null,
      typee:null,
      currentNodeId:null,
      
    }
  },
  created() {
    this.getPrimissionList()
  },
  methods:{ 
    async getPrimissionList() {
      this.list = transListToTreeData(await getPrimissionList(),0)
    },
    addPermission(pid, type) {
      this.showDialog = true
      this.pidd=pid
      this.typee=type
      
    },
    editPermission(id) {
      this.showDialog = true
      this.currentNodeId=id
      this.$nextTick(()=>{
          this.$refs.formData.getPermissionDetail()
        })
    },
    async delPermission(id) {
      try {
        await this.$confirm('确定要删除该数据吗')
        await delPermission(id)
        this.getPrimissionList()
        this.$message.success('删除成功')
      } catch (error) {
        console.log(error)
      }
    }
  }
}
</script>
<style>
.btn-add {
  margin:10px;
}
</style>
